<script>
export default {
  render() {
    return (
      <div style={{ display: this.isShow ? 'block' : 'none' }}>
        <div onClick={this.hide} class="comp-popover-cover"></div>
        <div style={{ top: this.top, left: this.left }} class="comp-popover">
          <this.comp user={this.user} hide={this.hide} />
        </div>
      </div>
    );
  },
  data() {
    return {
      isShow: false,
      top: '0px',
      left: '0px',
      comp: null,
      user: {},
    };
  },
  methods: {
    hide() {
      this.isShow = false;
    },
  },
};
</script>

<style>
.comp-popover-cover {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}

.comp-popover {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
  padding: 10px;
  background-color: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.103);
}
</style>
